<template>
    <div class="Venue_information">
    
    
    
    
    
    
    
        <div class="Venue_wrap">
    
    
    
            <div class="Venue_join">
    
    
    
                <div class="Venue_left">
    
    
    
                    <div class="Venue_title">
    
    
    
                        <span>场馆信息</span>
    
    
    
                    </div>
    
    
    
                    <div class="Venue_content">
    
    
    
                        <ul>
    
    
    
                            <li>
    
    
    
                                <span>场馆名称：</span>
    
    
    
                                <el-input v-model="input" placeholder="请输入场馆名称"></el-input>
    
    
    
    
    
    
    
                            </li>
    
    
    
                            <li>
    
    
    
                                <span>场馆位置：</span>
    
    
    
                                <el-input v-model="input" placeholder="请输入场馆位置"></el-input>
    
    
    
    
    
    
    
                            </li>
    
    
    
                            <li>
    
    
    
                                <span>营业时间：</span>
    
    
    
                                <div class="Venue_data">
    
    
    
                                    <el-input v-model="input" placeholder="开始时间" style="width:36%;"></el-input>
    
    
    
                                    <font>到</font>
    
    
    
                                    <el-input v-model="input" placeholder="结束时间" style="width:36%;"></el-input>
    
    
    
    
    
    
    
                                </div>
    
    
    
    
    
    
    
                            </li>
    
    
    
                            <li>
    
    
    
                                <span style="width:20%;">前台电话：</span>
    
    
    
                                <el-input v-model="input" placeholder="请输入电话" style="width:60%;"></el-input>
    
    
    
    
    
    
    
                            </li>
    
    
    
                            <li>
    
    
    
                                <span>场馆标签：</span>
    
    
    
                                <div class="view">
    
    
    
                                    <!-- <el-input v-model="tas" maxlength=4 style="width: 83%;border: none;height: 29px;" ></el-input> -->
    
    
    
                                    <input v-model="tas" maxlength=4 type="text" style="width: 83%;border: none;height: 29px;outline:none;">
    
    
    
                                    <el-button style="height:28px;background:#666666;padding:0 25px;" type="info" size="small" round>添加</el-button>
    
    
    
                                </div>
    
    
    
                            </li>
    
    
    
                            <li style="width:110%;margin-top:15px;">
    
    
    
                                <span style="width:25%;"></span>
    
    
    
                                <div class="label">
    
    
    
                                    <div class="label_top">
    
    
    
                                        <i class="el-icon-caret-bottom"></i>
    
    
    
                                        <font>查看推荐标签</font>
    
    
    
                                    </div>
    
    
    
                                    <div class="label_list">
    
    
    
                                        <ul>
    
    
    
                                            <li v-for="(item,index) in tags" :key="index">
    
    
    
                                                <i @click="tjtags(item,index)" class="el-icon-plus"></i>
    
    
    
                                                <span>{{item}}</span>
    
    
    
                                            </li>
    
    
    
                                        </ul>
    
    
    
                                    </div>
    
    
    
                                </div>
    
    
    
                            </li>
    
    
    
                        </ul>
    
    
    
                    </div>
    
    
    
                </div>
    
    
    
                <div class="Venue_right">
    
    
    
                    <p>场馆封面图：</p>
    
    
    
                    <div class="Venue_list">
    
    
    
                        <div class="Venue_image">
    
    
    
                            <i class="el-icon-picture"></i>
    
    
    
                            <span>上传场馆封面图</span>
    
    
    
                            <input type="file">
    
    
    
                        </div>
    
    
    
                        <el-button type="info" size="small" round>本地选择</el-button>
    
    
    
                    </div>
    
    
    
    
    
    
    
                </div>
    
    
    
            </div>
    
            <el-button type="primary" size="small" class="btn">保存</el-button>
    
    
    
        </div>
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    </div>
</template>
<script>
    export default {
    
    
    
        data() {
    
    
    
            return {
    
    
    
                input: '',
    
    
    
                tags: ['交通便利', '环境好', '动感单车', '有氧操课', '无氧器械', '运动氛围好', '课程多样', '教练专业']
    
    
    
    
    
    
    
            }
    
    
    
        },
    
        created() {
    
    
            let _this = this;
    
            let qs = require("qs");
            
            let obj = {
                
            }
    
            _this.$axios.post("/yujiaextend/gymadmin/findYogaGymById", qs.stringify(obj), {
    
                    headers: {
    
                        "Content-Type": "application/x-www-form-urlencoded"
    
                    }
    
                })
    
                .then((response) => {
                 
    
                })
    
                .catch((error) =>{
    
                    console.log(error);
    
                });
    
    
    
        },
    
    
    
        methods: {
    
    
    
    
    
    
    
        }
    
    
    
    }
</script>
<style scoped>
    .Venue_information {
    
        width: 100%;
    
        height: 100%;
    
        background: #f2f2f2;
    
        position: absolute;
    
        left: 250px;
    
        top: 0;
    
        z-index: 2;
    
    }
    
    
    
    .Venue_wrap {
    
        width: 80%;
    
        height: 100%;
    
        margin-left: 3%;
    
    }
    
    
    
    .Venue_join {
    
        width: 100%;
    
        display: flex;
    
    }
    
    
    
    .Venue_wrap .Venue_left {
    
        width: 50%;
    
        margin-top: 100px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_title {
    
        font-size: 18px;
    
        color: #000000;
    
        font-weight: bold;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_title span {
    
        padding-bottom: 5px;
    
        border-bottom: 5px solid #2d79f6;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content {
    
        width: 70%;
    
        margin-top: 60px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul {
    
        width: 100%;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li {
    
        display: flex;
    
        align-items: center;
    
        margin-top: 40px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li span {
    
        width: 25%;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .Venue_data {
    
        width: 100%;
    
        display: flex;
    
        align-items: center;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .Venue_data font {
    
        margin: 0 20px;
    
        font-size: 16px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .view {
    
        width: 100%;
    
        display: flex;
    
        align-items: center;
    
        padding-bottom: 5px;
    
        border-bottom: 1px solid #cdcdcd;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .view input {
    
        background: #f2f2f2;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .view .el-button {
    
        padding: 0 20px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label {
    
        width: 120%;
    
        text-align: left;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_top {
    
        width: 100%;
    
        font-size: 14px;
    
        color: #444444;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_top i {
    
        font-size: 16px;
    
        color: #aaaaaa;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_list {
    
        width: 100%;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_list ul {
    
        display: flex;
    
        align-items: center;
    
        flex-wrap: wrap;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_list ul li {
    
        padding: 5px 0;
    
        padding-right: 16px;
    
        padding-left: 8px;
    
        margin-top: 10px;
    
        background: url(../../assets/images/venue_management/venue_07.png) no-repeat;
    
        background-size: 100% 100%;
    
        margin-right: 12px;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_list ul li i {
    
        font-size: 12px;
    
        color: #b4b4b4;
    
    }
    
    
    
    .Venue_wrap .Venue_left .Venue_content>ul>li .label .label_list ul li span {
    
        font-size: 12px;
    
        color: #606060;
    
    }
    
    
    
    .Venue_wrap .Venue_right {
    
        margin-top: 12%;
    
    }
    
    
    
    .Venue_wrap .Venue_right>p {
    
        font-size: 16px;
    
        color: #000000;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list {
    
        display: flex;
    
        align-items: flex-end;
    
        margin-top: 20px;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list .Venue_image {
    
        width: 350px;
    
        height: 350px;
    
        background: #cdcdcd;
    
        text-align: center;
    
        position: relative;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list .Venue_image i {
    
        font-size: 30px;
    
        color: #aaaaaa;
    
        margin-top: 135px;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list .Venue_image span {
    
        display: block;
    
        font-size: 16px;
    
        color: #aaaaaa;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list .Venue_image input {
    
        width: 350px;
    
        height: 350px;
    
        border: none;
    
        outline: none;
    
        position: absolute;
    
        left: 0;
    
        top: 0;
    
        text-align: center;
    
        line-height: 350px;
    
        opacity: 0;
    
    }
    
    
    
    .Venue_wrap .Venue_right .Venue_list .el-button {
    
        margin-left: 20px;
    
        padding: 8px 20px;
    
        background: #666666;
    
    }
    
    
    
    .Venue_wrap .btn {
    
        margin-top: 120px;
    
        background: #2f7dfe;
    
        padding: 8px 33px;
    
    }
</style>


